﻿(function () {
    function _SidebarMenu(object, options) {
        try {
            var privateParameters = null;
            var isExtended = true;
            var effects;
            var contentHeight = 200;
            var openAccordion = '';
            var openArrow = '';
            var M2Height = 20;
            var duration = 250;
            var nID;
            var animateParameters;
            var oAID;
            var menuAppLinks;
            var toogleCollapseParameters;

            function _initialize(myDiv, options) {
                try {
                    privateParameters = new PrivateParameters(options);
                    privateParameters.myTimer;

                    privateParameters.timeRefresh = (privateParameters.timeRefresh) ? privateParameters.timeRefresh : 33;
                    privateParameters.duration = (privateParameters.duration) ? privateParameters.duration : 400;
                    //menuAppLinks.
                    privateParameters.isPopUpShow = false;
                    privateParameters.sidebar_popItem;
                    privateParameters.sidebar_subpopItem;
                    privateParameters.version.Namespace = 'IndustrialDashboard';
                    privateParameters.version.Class = 'SidebarMenu';
                    privateParameters.version.info = 'ID 2.0';
                    privateParameters.container = myDiv;
                    animateParameters = {};
                    toogleCollapseParameters = {};
                    toogleCollapseParameters.available = true;
                    menuAppLinks = {};
                    if (privateParameters.events) {
                        if (privateParameters.events.onError == undefined) privateParameters.events.onError = function (error) { };
                    } else privateParameters.events = {}; privateParameters.events.onError = function (error) { alert(error); };
                    effects = new FX();
                } catch (Error) { privateParameters.events.onError(Error); }
            };

            function _refreshData(parameters) {
                try {
                    var url = privateParameters.URL;
                    var options = {}; options.data = {};
                    if ((parameters) && (parameters.Version)) options.data = parameters.getSQLParameters();
                    else options = (parameters) ? parameters : options;
                    if ((options) && (options.method) && (options.method == 'GET')) options.data = null;
                    else {
                        options.data.Procedure = (privateParameters.Procedure) ? privateParameters.Procedure : '';
                        options.data.Namespace = privateParameters.version.Namespace;
                        options.data.Class = privateParameters.version.Class;
                    }

                    options.onSuccess = function (requestData) {
                        if ((requestData) && (!requestData.message))
                            privateParameters.data = requestData;
                        _redraw(privateParameters.container, requestData);
                    };
                    options.onFailure = function (args) {
                        privateParameters.events.onError(args);
                    }
                    RequestJSON(url, options);

                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _displayMenu() {
                try {
                    if (isExtended) {

                        isExtended = false;
                    } else {

                        isExtended = true;
                    }
                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _getContentIndex(obj) {
                try {
                    if (obj) {
                        if (obj.contentIndex != undefined) return obj.contentIndex;
                        else if (obj.parentElement) return _getContentIndex(obj.parentElement);
                        else if (obj.parentNode) return _getContentIndex(obj.parentNode);
                    } else return -1;
                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _toogleCollapse() {
                try {

                    var lastTick = toogleCollapseParameters.curTick;
                    var timeLeft = toogleCollapseParameters.timeLeft;
                    var timeRest = toogleCollapseParameters.timeRest;
                    var elem = toogleCollapseParameters.el;
                    if (elem.expectedHeight == undefined) elem.expectedHeight = (elem.currentStyle) ? (elem.currentStyle.height.indexOf('px') ? parseInt(elem.currentStyle.height.replace('px', '')) : parseInt(elem.currentStyle.height.replace('%', ''))) : '450px';
                    toogleCollapseParameters.available = false;

                    var curTick = new Date().getTime();
                    var elapsedTicks = curTick - lastTick;
                    if (elem) {
                        if (timeLeft <= elapsedTicks) {
                            toogleCollapseParameters.available = true;
                            if (!isExtended) { elem.style.height = elem.expectedHeight + 'px'; elem.style.display = 'block'; isExtended = true; }
                            else { elem.style.height = '0px'; elem.style.display = 'none'; isExtended = false; }
                            return;
                        }
                        timeLeft -= elapsedTicks;
                        timeRest += elapsedTicks;
                        var newHeight = 0;
                        if (elem) {
                            if (!isExtended) {
                                newHeight = elem.expectedHeight;
                                if (elem.style.display != 'block') elem.style.display = 'block';
                                newHeight = Math.round((timeRest / privateParameters.duration) * elem.expectedHeight);
                            } else newHeight = Math.round((timeLeft / privateParameters.duration) * elem.expectedHeight);
                            elem.style.height = newHeight + 'px';
                        }
                    }

                    var fn = _toogleCollapse;
                    toogleCollapseParameters.curTick = curTick;
                    toogleCollapseParameters.timeLeft = timeLeft;
                    toogleCollapseParameters.timeRest = timeRest;
                    setTimeout(fn, privateParameters.timeRefresh);

                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _animate() {
                try {
                    var lastTick = animateParameters.curTick;
                    var timeLeft = animateParameters.timeLeft;
                    var timeRest = animateParameters.timeRest;
                    var closingId = animateParameters.closingId;
                    var openingId = animateParameters.openingId;
                    var openingArrowId = animateParameters.openingArrowId;
                    var closingArrowId = animateParameters.closingArrowId;

                    var curTick = new Date().getTime();
                    var elapsedTicks = curTick - lastTick;
                    var opening = (openingId == '') ? null : document.getElementById(openingId);
                    var closing = (closingId == '') ? null : document.getElementById(closingId);
                    var arrowOpen = (openingArrowId == '') ? null : document.getElementById(openingArrowId);
                    var arrowClose = (closingArrowId == '') ? null : document.getElementById(closingArrowId);
                    if (opening) {
                        if (timeLeft <= elapsedTicks) {
                            opening.style.height = opening.expectedHeight + 'px'; opening.style.display = 'block';
                            if (arrowOpen != null) arrowOpen.className = 'arrowDown';
                            if (closing != null) { closing.style.height = '0px'; closing.style.display = 'none'; }
                            if (arrowClose != null) arrowClose.className = 'arrowUp';
                            return;
                        }
                        timeLeft -= elapsedTicks;
                        timeRest += elapsedTicks;
                        var newClosedHeight = 0;
                        if (closing) {
                            newClosedHeight = Math.round((timeLeft / duration) * closing.expectedHeight);
                            closing.style.height = newClosedHeight + 'px';
                        }
                        var newOpenedHeight = 0;
                        if (opening) {
                            newOpenedHeight = opening.expectedHeight;
                            if (opening.style.display != 'block') opening.style.display = 'block';
                            opening.style.height = Math.round((timeRest / duration) * newOpenedHeight); +'px';
                        }
                        var fn = _animate;
                        animateParameters = {};
                        animateParameters.curTick = curTick;
                        animateParameters.timeLeft = timeLeft;
                        animateParameters.timeRest = timeRest;
                        animateParameters.closingId = closingId;
                        animateParameters.openingId = openingId;
                        animateParameters.openingArrowId = openingArrowId;
                        animateParameters.closingArrowId = closingArrowId;
                        setTimeout(fn, privateParameters.timeRefresh);
                    }
                } catch (Error) { privateParameters.events.onError(Error); }
            };

            function _accordionTitleClick(e) {

                try {
                    var target = e.target || window.event.srcElement; //contentIndex                    
                    var index = _getContentIndex(target);
                    nID = "Accordion" + index + "Content";
                    oAID = "Accordion" + index + "Arrow";
                    animateParameters = {};
                    animateParameters.curTick = new Date().getTime();
                    animateParameters.timeLeft = duration;
                    animateParameters.timeRest = 0;
                    animateParameters.closingId = openAccordion;
                    animateParameters.closingArrowId = openArrow;
                    animateParameters.openingId = nID;
                    animateParameters.openingArrowId = oAID;
                    if (openAccordion != nID) _animate();
                    openAccordion = nID;
                    openArrow = oAID;
                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _menuDefinitionsClick(e) {
                try {
                    var target = e.target || window.event.srcElement;
                    alert(target.innerHTML);
                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _menuItemClick(e) {
                try {
                    var target = e.target || window.event.srcElement;
                    alert(target.innerHTML);
                } catch (Error) { privateParameters.events.onError(Error); }
            };
            function _redraw(container, data) {
                try {
                    if ((container) && (data)) {
                        container.innerHTML = ''; //??
                        var uxSidebarMenu = document.createElement('div');
                        uxSidebarMenu.id = data.AccordionName;
                        uxSidebarMenu.className = 'SidebarMenu';
                        container.appendChild(uxSidebarMenu);

                        var uxTitle = document.createElement('div');
                        uxTitle.className = 'title';
                        uxTitle.innerHTML = 'Menu';
                        uxTitle.onclick = function () {
                            effects.Collapse.toogle();
                            //                            if (toogleCollapseParameters.available) {
                            //                                toogleCollapseParameters.curTick = new Date().getTime();
                            //                                toogleCollapseParameters.timeLeft = privateParameters.duration;
                            //                                toogleCollapseParameters.timeRest = 0;
                            //                                _toogleCollapse();
                            //                            }
                        };
                        uxSidebarMenu.appendChild(uxTitle);

                        //AccordionCOntainer
                        var uxMenuContainer = document.createElement('div');
                        toogleCollapseParameters.el = uxMenuContainer;
                        //uxMenuContainer.expectedHeight = '450';
                        var options = { 'duration': privateParameters.duration, 'fromWidth': '250px', 'toWidth': '250px', 'fromHeight': '500px', 'toHeight': '0px' };
                        effects.Collapse(uxMenuContainer, options);
                        uxMenuContainer.className = 'menuContainer';
                        uxSidebarMenu.appendChild(uxMenuContainer);

                        //MenuBorders
                        var tbl = document.createElement('div');
                        tbl.className = 'topBorderLeft';
                        uxMenuContainer.appendChild(tbl);

                        var tbr = document.createElement('div');
                        tbr.className = 'topBorderRight';
                        uxMenuContainer.appendChild(tbr);

                        var bl = document.createElement('div');
                        bl.className = 'borderLeft';
                        uxMenuContainer.appendChild(bl);

                        var br = document.createElement('div');
                        br.className = 'borderRight';
                        uxMenuContainer.appendChild(br);

                        var bbl = document.createElement('div');
                        bbl.className = 'bottomBorderLeft';
                        uxMenuContainer.appendChild(bbl);

                        var bbr = document.createElement('div');
                        bbr.className = 'bottomBorderRight';
                        uxMenuContainer.appendChild(bbr);

                        var uxMenuBackground = document.createElement('div');
                        uxMenuBackground.className = 'menuBackground';
                        uxMenuContainer.appendChild(uxMenuBackground);

                        //All Items //////////////////////////////////
                        var uxAccordionContainer = document.createElement('div');
                        uxAccordionContainer.className = 'accordionContainer';
                        uxMenuBackground.appendChild(uxAccordionContainer);

                        //Accordion Border

                        var uxAbt = document.createElement('div');
                        uxAbt.className = 'abt';
                        uxAccordionContainer.appendChild(uxAbt);

                        var uxAb = document.createElement('div');
                        uxAb.className = 'ab';
                        uxAccordionContainer.appendChild(uxAb);

                        var uxAbb = document.createElement('div');
                        uxAbb.className = 'abb';
                        uxAccordionContainer.appendChild(uxAbb);

                        //Region M1
                        //MenuItems[]

                        for (var m1 = 0; m1 < data.MenuItems.length; m1++) {
                            var mi = data.MenuItems[m1];
                            var uxM1Container = document.createElement('div');
                            uxM1Container.className = 'M1Container';
                            uxAb.appendChild(uxM1Container);
                            uxM1Container.contentIndex = m1;
                            //content                                                      
                            addEventHandler(uxM1Container, 'onclick', _accordionTitleClick);
                            var uxAccordionTitle = document.createElement('div');
                            uxAccordionTitle.className = 'accordionTitle';
                            uxAccordionTitle.innerHTML = mi.Name;
                            eval('menuAppLinks.hash' + mi.ID + '= mi');
                            uxM1Container.appendChild(uxAccordionTitle);

                            if (mi.Image) {
                                var uxAccordionImage = document.createElement('div');
                                uxAccordionImage.className = 'accordionImage';
                                uxM1Container.appendChild(uxAccordionImage);
                                //if Image add padding to the text;
                                uxAccordionTitle.style.paddingLeft = '25px';
                                uxAccordionImage.className = uxAccordionImage.className + ' , ' + mi.Image;
                            }

                            var uxAccordionContent = document.createElement('div');
                            uxAccordionContent.className = 'accordionContent';
                            uxAb.appendChild(uxAccordionContent);
                            uxAccordionContent.id = 'Accordion' + m1 + 'Content';
                            var MDVisibles = 0;
                            if ((mi.MenuDefinitions) && (mi.MenuDefinitions.length > 0)) {
                                //Draw Arrow
                                var uxDraw = document.createElement('div');
                                uxDraw.className = 'arrowUp';
                                uxDraw.id = 'Accordion' + m1 + 'Arrow';
                                uxM1Container.appendChild(uxDraw);
                                //Region M2
                                //MenuDefinitions
                                for (var m2 = 0; m2 < mi.MenuDefinitions.length; m2++) {
                                    var md = mi.MenuDefinitions[m2];
                                    eval('menuAppLinks.hash' + md.ID + '=md');
                                    if (md.Visible) {
                                        MDVisibles++;
                                        var uxM2 = document.createElement('div');
                                        uxM2.className = 'M2Container';
                                        uxAccordionContent.appendChild(uxM2);
                                        uxM2.innerHTML = md.Name;
                                        if ((md.PopupItems) && (md.PopupItems.length > 0)) {
                                            addEventHandler(uxM2, 'onclick', _menuDefinitionsClick);
                                            /* Region M3 */
                                            /* PopupItems */
                                            //                                        uxM2.style.height = ((md.PopupItems.length+1) * 18) + 'px';
                                            //                                        for (var m3 = 0; m3 < md.PopupItems.length; m3++) {
                                            //                                            var pi = md.PopupItems[m3];
                                            //                                            var uxM3 = document.createElement('div');
                                            //                                            uxM3.className = 'M3Container';
                                            //                                            uxM3.innerHTML = pi.Name;
                                            //                                            uxM2.appendChild(uxM3);
                                            //                                        }
                                        } else addEventHandler(uxM2, 'onclick', _menuDefinitionsClick);
                                    } else {
                                        //not Visible                                        
                                    }
                                }
                            } else addEventHandler(uxM1Container, 'onclick', _menuItemClick);
                            uxAccordionContent.expectedHeight = (MDVisibles * M2Height);
                            uxAccordionContent.style.height = (MDVisibles * M2Height) + 'px';

                            //setTarget;

                            //                                mi.onclick = function () {
                            //                                    alert(mi.Target);                                   
                            //                                };

                        } //end for

                        //////////////////////////////////////////////

                        //Options Area ///////////////////////////////
                        var uxOptionsContainer = document.createElement('div');
                        uxOptionsContainer.className = 'optionsContainer';
                        uxMenuBackground.appendChild(uxOptionsContainer);

                        var uxbtoc = document.createElement('div');
                        uxbtoc.className = 'btoc';
                        uxOptionsContainer.appendChild(uxbtoc);

                        var uxboc = document.createElement('div');
                        uxboc.className = 'boc';
                        uxOptionsContainer.appendChild(uxboc);

                        var uxbboc = document.createElement('div');
                        uxbboc.className = 'bboc';
                        uxOptionsContainer.appendChild(uxbboc);

                        //Search
                        var uxSearchContainer = document.createElement('div');
                        uxSearchContainer.className = 'appContainer';
                        uxOptionsContainer.appendChild(uxSearchContainer);

                        var uxSearchInputText = document.createElement('input');
                        uxSearchInputText.type = 'text';
                        uxSearchInputText.className = 'text';
                        uxSearchContainer.appendChild(uxSearchInputText);

                        var uxSearchInputButton = document.createElement('input');
                        uxSearchInputButton.type = 'button';
                        uxSearchInputButton.className = 'button';
                        uxSearchInputButton.value = 'Search';
                        uxSearchInputButton.onclick = function () {
                            if (menuAppLinks) {
                                var value = trim(uxSearchInputText.value);
                                for (var item in menuAppLinks) {
                                    var hash = menuAppLinks[item];
                                    if (hash.AppCode == value) { alert(hash.Name); uxSearchInputText.value = ''; return; };
                                }
                            };
                        };
                        uxSearchContainer.appendChild(uxSearchInputButton);

                        // /*Other Options*/
                        var uxOtherContainer = document.createElement('div');
                        uxOtherContainer.className = 'appContainer';
                        uxOtherContainer.style.top = '50px';
                        uxOptionsContainer.appendChild(uxOtherContainer);

                        var uxOtherInputText = document.createElement('input');
                        uxOtherInputText.type = 'text';
                        uxOtherInputText.className = 'text';
                        uxOtherContainer.appendChild(uxOtherInputText);

                        var uxOtherInputButton = document.createElement('input');
                        uxOtherInputButton.type = 'button';
                        uxOtherInputButton.className = 'button';
                        uxOtherInputButton.value = 'Execute';
                        uxOtherContainer.appendChild(uxOtherInputButton);
                        ////////////////////////////////////////////
                    }
                } catch (Error) { privateParameters.events.onError(Error); }
            };

            _initialize(object, options);

            this.refreshData = function (parameters) {
                _refreshData(parameters);
            };

        } catch (Error) { privateParameters.events.onError(Error); }
    }
    window.SidebarMenu = function (object, options) { return new _SidebarMenu(object, options); };
})();
